<template>
    <section class="server_list_right_view">
        	<div class="step" v-for="(item,index) in steps" :key = "index">
        		<p class="step_p">{{Number(index)+1}}.{{item.title}}</p>
        		<div class="stepItem">
        			<p class="stepItem_p" v-for="(stepItem ,stepIndex) in item.stepItem">
        				<span>{{stepItem.titel}}:{{stepItem.textVal}}</span>
        			</p>
        		</div>
        	</div>
        	
        	<div class="table_content">
        			<table-plane class="table_item" :tableLabel="tableLabel" :tableData="tableData"></table-plane>
        			<table-plane  class="table_item" :tableLabel="table2Label" :tableData="table2Data"></table-plane>
        	</div>
    </section>
</template>

<script>
    import tablePlane from "./tablePlane"
    export default {
    	components:{
    		tablePlane,
    	},
        data() {
          return {
          			steps:[
          				{
          					title:'基本信息',
	          				stepItem:[
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					}
	          				],
          				},
          				{
          					title:'基本信息',
	          				stepItem:[
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					}
	          				],
          				},
          				{
          					title:'基本信息',
	          				stepItem:[
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					},
	          					{
	          						titel:'服务标识',
	          						textVal:"SFZ_201805215"
	          					}
	          				],
          				}
          			],
          			tableLabel:{
          				name:'参数名',
          				type:'类型',
          				isHas:'是否必需',
          				isCheck:'是否校验',
          				yuanData:"对应元数据"
          			},
          			table2Label:{
          				name:'参数名',
          				type:'类型',
          				backData:"返回元数据"
          			},
          			tableData:[
	          			{
	          				name:'dwdwda',
	          				type:'string',
	          				isHas:'是',
	          				isCheck:'是',
	          				yuanData:"身份证号码"
	          			},
	          			{
	          				name:'dwdwda',
	          				type:'string',
	          				isHas:'是',
	          				isCheck:'是',
	          				yuanData:"身份证号码"
	          			}
          			],
          			table2Data:[
          				{
          					name:'age',
	          				type:'int',
	          				backData:"年龄"
          				},
          				{
          					name:'age',
	          				type:'int',
	          				backData:"年龄"
          				},
          			],
          };
        },
        methods: {
        
        }
  };
</script>

<style scoped="scoped">
	.stepItem{
		padding-left: 25px;
	}
    .stepItem_p{
    	display: inline-block;
    	width: 50%;
    	margin: 10px 0;
    	font-size: 13px;
    }
    .step_p{
    	    font-size: 15px;
    		color: black;
    		padding-left: 10px;
    		margin-top: 10px;
    }
    .table_content{
    	padding: 5px 8px;
    }
    .table_item{
    	margin: 10px 0;
    }
</style>